<template>
	<view class="refund">
		<view class="wrapper">
			<view class="top d-flex">
				<u-image :src="itemarr.picture" width="190rpx" height="190rpx" radius="12rpx"></u-image>
				<view style="margin-left: 30rpx;">
					<view class="name">{{ itemarr.production_name }}</view>
					<!-- <view class="date">{{ data.date }}</view> -->
					<view class="count">×1</view>
				</view>
			</view>

			<u-line margin="30rpx 0" color="#E5E5E5"></u-line>

			<view class="flex-between">
				<view>
					退款金额<text style="color: #BEBEBE;">(实付金额)</text>
				</view>
				<price :value="itemarr.payment" color="#FF4105"></price>
			</view>

			<u-line margin="30rpx 0" color="#E5E5E5"></u-line>

			<view>
				<view class="flex-between">
					<view class="">退回账户</view>
					<view class="flex-align">
						<!-- <u-icon name="weixin-fill" color="#00c800" size="58rpx"></u-icon> -->
						<view>原路返回</view>
					</view>
				</view>

				<!-- <view style="color: #888888; margin-top: 14rpx; font-size: 24rpx;">
					(<text style="color: #FF8F05;">1-3个工作日内</text>到账，若原路退回失败，款项会尝试退还至您美团 钱包的余额)
				</view> -->
			</view>

			<u-line margin="30rpx 0" color="#E5E5E5"></u-line>

			<view>退款原因</view>
			<u-textarea v-model="remark" placeholder="填写原因" border="none" height="180"></u-textarea>
		</view>
		<view class="bottom-add-btn">
			<u-button text="提交" shape="circle" @click="Refund"
				color="linear-gradient(0deg, #0E9698 0%, #0E9698 100%)"></u-button>
		</view>
	</view>
</template>

<script>
	const index = require("@/api/index/index.js");
	export default {
		data() {
			return {
				itemarr: {},
				remark:"",
			}
		},
		// 在test.vue页面接受参数
		onLoad(option) {
			const item = JSON.parse(decodeURIComponent(option.item));
			this.itemarr = item
		},

		methods: {
			// 获取我的待付款订单
			async Refund() {
				let that = this;
				if (this.itemarr.bill_type == 'card') {
					let postData = {
						orderid: that.itemarr.orderid,
						id: that.itemarr.id,
						money: that.itemarr.payment,
						operator_id: 1,
						is_force: '-1',
						refund_type:1,
						remark: that.remark,
					};
					let res = await index.card_refund_pay(postData);
					if (res.code == 1) {
						uni.showToast({
							title: res.msg,
							icon: 'success'
						})
						setTimeout(() => {
							uni.navigateBack({
								delta: 1, //返回层数，2则上上页
							})
						}, 1000)
					}else{
						uni.showToast({
							title: res.msg,
							icon: 'none'
						})
					}
				} else if (this.itemarr.bill_type == 'ticket') {
					let postData = {
						orderid: that.itemarr.orderid,
						id: that.itemarr.id,
						money: that.itemarr.payment,
						operator_id: 1,
						is_force: '-1',
						refund_type:1,
						remark: that.remark,
					};
					let res = await index.ticket_refund_pay(postData);
					if (res.code == 1) {
						uni.showToast({
							title: res.msg,
							icon: 'success'
						})
						setTimeout(() => {
							uni.navigateBack({
								delta: 1, //返回层数，2则上上页
							})
						}, 1000)
					}else{
						uni.showToast({
							title: res.msg,
							icon: 'none'
						})
					}
				} else if (this.itemarr.bill_type == 'place') {
					let postData = {
						orderid: that.itemarr.orderid,
						id: that.itemarr.id,
						money: that.itemarr.payment,
						operator_id: 1,
						is_force: '-1',
						refund_type:1,
						remark: that.remark,

					};
					let res = await index.place_refund_pay(postData);
					if (res.code == 1) {
						uni.showToast({
							title: res.msg,
							icon: 'success'
						})
						setTimeout(() => {
							uni.navigateBack({
								delta: 1, //返回层数，2则上上页
							})
						}, 1000)
					}else{
						uni.showToast({
							title: res.msg,
							icon: 'none'
						})
					}
				}

			},

		}
	}
</script>

<style lang="scss" scoped>
	.refund {
		min-height: 100vh;
		background-color: #f7f7f7;
		padding-bottom: calc(150rpx + env(safe-area-inset-bottom));

		.wrapper {
			background-color: #fff;
			padding: 30rpx;
		}

		.top {
			.name {
				color: #333;
				margin-bottom: 20rpx;
			}

			.date {
				margin-bottom: 30rpx;
				background-color: #f3f3f3;
				color: rgb(136, 136, 136);
				font-size: 24rpx;
				border-radius: 100px;
				padding: 4rpx 20rpx;
			}
		}

		/deep/.u-textarea {
			background-color: #f3f3f3;
			margin-top: 30rpx;
		}
	}
</style>